<template>
    <view class="uni-shadow tem" @tap.stop="detail">
        <view class="font-bold">{{wageData.name}}</view>
        <u-row class="u-m-t-10 u-flex u-flex-wrap">
            <u-col v-for="(item,index) in wageData.list" :key="index" span="6" class="u-m-t-20 u-font-26 col">
                <text class="u-m-r-20 uni-dec-color">{{item.title}}</text>
                <u--text v-if="item.type=='phone'" mode="phone" :text="item.value" size="14" type="primary"></u--text>
                <text v-else>{{item.value}}</text>
            </u-col>
        </u-row>
    </view>
</template>


<script>
export default {
    name: 'wageItem',
    props: {
        wageData: {
            type: Object,
            default () {
                return {
                    name:'项目名称',
                    list:[
                        { title:'属地类型', value:'一师'},
                        { title:'工资发放月(最近)', value:'150'},
                        { title:'最近发放人数', value:'200'},
                        { title:'最近发放金额', value:'10%'},
                        { title:'累积发放次数', value:'200'},
                        { title:'累积发放人数', value:'某某某'},
                        { title:'累积发放金额', value:'1500万元'},
                    ]
                }
            }
        }
    },

    methods: {
        // 工资详情
        detail(){
            uni.navigateTo({
                url: '/pages/wage-bag/detail'
            })
        }
    },
}
</script>


<style scoped lang="scss">
    .tem{
        height: auto;
        border-radius: 16rpx;
        border: 1rpx solid #f8f8f8;
        box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.05);
        padding: 30rpx;
        flex-direction: column !important;
        align-items: flex-start;
        .col{
            flex-direction: row;
        }
    }
</style>